// @flow
import React from 'react'
import styles from './index.css'
import Spectrum from 'components/Spectrum2'
import type { Location } from 'react-router'

type Props = {
  location: Location,
}
type State = {}

const { search } = location
const paramsString = search.substring(1)
const searchParams = new URLSearchParams(paramsString)

class SpecificGram extends React.Component {
  props: Props
  state: State
  constructor (props: Object) {
    super(props)
    this.state = {}
  }
  componentWillMount () {
    const token = searchParams.get('token')
    if (token) {
      localStorage.setItem('asset_token', token)
    }
  }
  render () {
    const requestType = searchParams.get('requestType')
    const sampleTime = searchParams.get('sampleTime')
    const sensorNameEn = searchParams.get('sensorNameEn')
    const sensorName = searchParams.get('sensorName')
    const channelId = searchParams.get('channelId')
    const channelName = searchParams.get('channelName')
    const kmxVariableNameEn = searchParams.get('kmxVariableNameEn')
    const kmxVariableName = searchParams.get('kmxVariableName')
    const deviceId = searchParams.get('deviceId')
    const deviceNo = searchParams.get('deviceNo')
    return (
      <div className={styles['main']}>
        <Spectrum {...{
          requestType,
          type: 'line',
          historyCond: {
            'monitors': [
              {
                En: sensorNameEn,
                channelIds: [channelId],
                channelNames: [{ id: channelId, name: channelName }],
                key: [kmxVariableNameEn],
                keyName: [{ key: kmxVariableNameEn, name: kmxVariableName }],
                sensorType: sensorName
              }
            ]
          },
          deviceData: {
            id: deviceId,
            deviceNo: deviceNo
          },
          checkTime: Number(sampleTime),
          checkName: `${kmxVariableName}__${channelName}`,
          channel_id: channelId
        }} />
      </div>
    )
  }
}
export default SpecificGram
